import React, {useRef} from 'react';
import ProTable, {ActionType} from '@ant-design/pro-table';
import {queryUse} from "@/utils/service";
import {columnsSorter, formatNum} from "@/utils/function";
import {PageContainer} from "@ant-design/pro-layout";
import {queryCrossProfitList} from "@/pages/Futuers/service";
import {Card} from "antd";

const CrossProfitList: React.FC = () => {
    const columns: any[] = [
      {
        title: "平台名称",
        search: false,
        dataIndex: 'name',
        key: 'name',
        width: 100,
      },
      {
        title: "总资产",
        search: false,
        dataIndex: 'totalAssets',
        key: 'totalAssets',
        width: 100,
        renderText: (val: number) => formatNum(val, 4)
      },
      {
        title: "可用资产",
        search: false,
        dataIndex: 'availableAssets',
        key: 'availableAssets',
        width: 100,
        renderText: (val: number) => formatNum(val, 4)
      },
      {
        title: "未实现盈亏",
        search: false,
        dataIndex: 'unRealizedPnl',
        key: 'unRealizedPnl',
        width: 100,
        renderText: (val: number) => formatNum(val, 4)
      },
     {
        title: "已实现盈亏",
        search: false,
        dataIndex: 'realizedPnl',
        key: 'realizedPnl',
        width: 100,
        renderText: (val: number) => formatNum(val, 4)
      },
      {
        title: "当前平均杠杆",
        search: false,
        dataIndex: 'averageLeverage',
        key: 'averageLeverage',
        width: 100,
        renderText: (val: number) => formatNum(val, 4)
      },
      {
        title: "投资金额",
        search: false,
        dataIndex: 'invest',
        key: 'invest',
        width: 100,
        renderText: (val: number) => formatNum(val, 4)
      },
    ];
    columnsSorter("CrossProfitList跨平台套利记录列表", columns);
    const actionRef = useRef<ActionType>();
    return (
      <PageContainer>
        {/**
         *@table
         */}
         <Card>
           <ProTable<any>
             headerTitle={"跨平台套利记录列表"}
             style={{margin:'20px'}}
             bordered
             actionRef={actionRef}
             cardBordered={false}
             // footer={()=>"1111"}
             search={false}
             onColumnsStateChange={(e) => {
             }}
             toolBarRender={() => []}
             request={async (params = {}, sort, filter) => {
               const msg = await queryCrossProfitList();
               let data = queryUse(msg)
               if (data) {
                 let sumIds: any[] = [];
                 let sumItem: any = {
                   name: "合计",
                   totalAssets: 0,
                   availableAssets: 0,
                   realizedPnl: 0,
                   unRealizedPnl: 0,
                   averageLeverage: 0,
                   invest: 0,
                 }
                 for (let i = 0; i < data.length; i++) {
                   const item = data[i];
                   for (let key in sumItem) {
                     if (key !== "name") {
                       sumItem[key] += (item[key] ? item[key] : 0);
                     }
                   }
                 }
                 sumItem.id = sumIds;
                 data.unshift(sumItem)
                 return {
                   data: data,
                   success: true,
                 };
               } else {
                 return {
                   data: [],
                   success: false,
                 };
               }
             }}
             columns={columns}
             pagination={false}
           />
         </Card>
      </PageContainer>
    );
  }
;

export default CrossProfitList;
